<template>
  <div>
    <Navbar :goodName="goodDetail.name" />
    <van-swipe :autoplay="3000" lazy-render>
      <van-swipe-item v-for="image in goodDetail.s_goods_photos" :key="image">
        <img :src="image.path" class="banner" />
      </van-swipe-item>
    </van-swipe>
    <!-- 详情 -->
    <div v-html="goodDetail.rich_text"></div>
    <!-- 操作 -->
    <ActionBar />
  </div>
</template>

<script setup>
import Navbar from '@/components/navBar/Navbar.vue';
import ActionBar from './components/ActionBar.vue';
import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router';
import useGoodStore from '@/stores/good';
const goodStore = useGoodStore();
const route = useRoute();
goodStore.getGoodDetail(route.params.id);
const { goodDetail } = storeToRefs(goodStore);
</script>

<style lang="scss" scoped>
.banner {
  width: 100vw;
  height: auto;
}
</style>
